iT邦幫忙

2022 iThome 鐵人賽

DAY 26
0
Modern Web

從入門前端技巧到uiux設計的心得分享系列 第 26

【Day 26】使用Sourcetree視覺化git作業

  • 分享至 

  • xImage
  •  

在公司面試時基本上一定會問你會不會使用git來管理程式碼,git除了可以很好的管理程式的版本,在多人協作開發時也是很重要的工具。
https://ithelp.ithome.com.tw/upload/images/20221005/20152090JJfvbEOSAT.png

有鑑於git的教學已經非常多,這篇就來介紹Sourcetree這個軟體,這個軟體將git的女多常用功能視覺化,讓你能很直覺地去操作你的專案。如果你已經學會git的基本指令,或許你會跟我一樣覺得輸入指令的方式繁瑣枯燥又抽象,那Source會是你的好夥伴。


開始使用

首先-下載並安裝
https://ithelp.ithome.com.tw/upload/images/20221005/20152090fvmYxDrehc.png

打開後便是將你的repo加入的環節,repo可以選擇加入local端的或remote端的repository,我個人傾向以clone的方式加入,以下可以看到我已經加入過三個repo,且被我打了馬。
https://ithelp.ithome.com.tw/upload/images/20221005/201520908zjbvtfapI.png

透過clone的方式加入,在github的地方複製repo的網址:
https://ithelp.ithome.com.tw/upload/images/20221005/201520904LSxIDDToC.png
在Sourcetree的navbar點選Clone,並貼上網址:
https://ithelp.ithome.com.tw/upload/images/20221005/20152090Tj5sVr05OV.png
Clone完後基本上就是以下畫面,我拿以前工作的repo當範例(這例子比較好用)
https://ithelp.ithome.com.tw/upload/images/20221005/20152090NT8iVxkoP8.png

介面介紹

接下來就是界面介紹的部分啦~
https://ithelp.ithome.com.tw/upload/images/20221005/201520900iObRkNlmV.png

  1. git的常用指令,需要commit時直接點commit就可以到另一個頁面選擇stage,且多人開發需要push時先按fetch看有沒有其他人push再pull,如果在別人push後你卻沒有pull而直接push也不至於把專案弄壞,sourcetree在這點有防呆(一般輸入指令的方式沒有防呆在這裡會出事)。
  2. 分支列表。
  3. 各分支commit紀錄,點選可以在4查看內容。
  4. 查看該次commit有改動的檔案,點選後可在5查看內容。
  5. 查看該檔案的改動內容,綠色+是新增的行;紅色-是刪除的行。

以上列表應該可以感覺到Sourcetree的方便之處了,我們再來看點選commit後的部分
https://ithelp.ithome.com.tw/upload/images/20221005/20152090rC8SAUrBvd.png

  1. 下方有更動且尚未stage的檔案,案 + 會加到上方staged的區塊
  2. 查看該檔案的改動內容,綠色+是新增的行;紅色-是刪除的行。
  3. commit訊息,輸入完按下commit按鈕便commit完了。

上一篇
【Day 25】 UI上的字體應用心得,字體知識篇
下一篇
【Day 27】 UI上的字體應用心得,實作篇
系列文
從入門前端技巧到uiux設計的心得分享30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言